<template>
  <MkQueryContainer>
    <template #header="">
      <MkForm ref="queryForm" :model="searchParam" :inline="true">
        <MkInput label="关键字" @keyup.enter.native="search" v-model="searchParam.keyword" clearable="" />
        <el-form-item>
          <MkButtonQuery @click="search"> </MkButtonQuery>
          <MkButtonAdd @click="add"> </MkButtonAdd>
        </el-form-item>
      </MkForm>
    </template>
    <MkTable :data="tableData" v-loading="loading" @row-dblclick="edit">
      <MkColumnIndex />
      <MkColumn prop="mingCheng" label="名称" />
      <MkColumn prop="remark" label="备注" />
      <MkColumnIsEnabled />
      <MkColumnOption @show="edit" :isMore="false" />
    </MkTable>
    <MkPagination v-model:page="searchParam.page" v-model:pageSize="searchParam.pageSize" :total="total"
      @query="search" />
    <EditPage ref="editPageRef" @query="search" />
  </MkQueryContainer>
</template>

<script lang='ts' setup name="basXueYeChanPinFeiYong">
// 血液产品费用主表
import { BasXueYeChanPinFeiYongApi, BasXueYeChanPinFeiYongOutput } from '/@/api/bas/BasXueYeChanPinFeiYong';
import { usePageQuery } from '/@/hooks/usePageQuery'
import { clog, showSuccess } from '/@/utils'

import EditPage from './edit.vue'

const { searchParam, total, tableData, loading, search } = usePageQuery<BasXueYeChanPinFeiYongOutput>(BasXueYeChanPinFeiYongApi.page)

const editPageRef = ref();

onMounted(() => {
  search();
})

const add = () => {
  editPageRef.value.open();
}

const edit = (row: any) => {
  editPageRef.value.open(row);
}
</script>

<style lang='scss' scoped></style>